@extends("Index.base")

@section("main")

    <div ng-controller="IndexController">

        <div  style="height:100%;position: absolute;z-index:-2;width: 100%;top:0%" id="bgi">
            <img src="/image/001.jpg" class="full_image" >

        </div>
        <div  style="height:100%;position: absolute;z-index:-2;width: 100%;top:100%">

            <img src="/image/147.jpg" class="full_image" >
        </div>
        <div class="col-sm-12" style="height: 400px;">
            <div class="col-sm-3 col-sm-offset-8" style="margin-top: 20px;margin-bottom:20px">
                <h2 class="display_win_h2">社交化的博客文档，获取更多精品内容</h2>
            </div>
        </div>
        <div class="col-sm-12 content_big_div" style="height: 600px;" >
            <div class="col-sm-10 col-sm-offset-1">

                <div class="col-sm-4 content_3_small_div" >
                    <div class="panel panel-default">
                        <div class="panel-body" >
                            <span  class=" glyphicon glyphicon-paperclip span_ico_size" aria-hidden="true"></span><br>
                            <div style="margin-bottom: 5px">
                               <h2>文档</h2>
                                <p>轻松阅读，投您所好，收藏，标记，不放过每一个细节</p>
                            </div>


                        </div>
                    </div>

                </div>

                <div class="col-sm-4 content_3_small_div" >
                    <div class="panel panel-default">
                        <div class="panel-body" >
                            <span  class=" glyphicon glyphicon-camera span_ico_size" aria-hidden="true"></span><br>
                            <div style="margin-bottom: 5px">
                               <h2>照片</h2>
                                <p>一本图像，一串记忆，记录人生百味，生活点滴</p>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="col-sm-4 content_3_small_div" >
                    <div class="panel panel-default">
                        <div class="panel-body" >
                            <span  class=" glyphicon glyphicon-inbox span_ico_size" aria-hidden="true"></span><br>
                            <div style="margin-bottom: 5px">
                                <h2>专题</h2>
                                <p>结构化的内容，让您无需担心松散的知识，提高阅读效率</p>

                            </div>


                        </div>
                    </div>

                </div>

                <div class="col-sm-4 content_3_small_div" >
                    <div class="panel panel-default">
                        <div class="panel-body" >
                            <span  class="  glyphicon glyphicon-heart span_ico_size" aria-hidden="true"></span><br>
                            <div style="margin-bottom: 5px">
                                <h2>兴趣</h2>
                                <p>大千世界，无限风情，畅聊千奇百怪，品味生活乐趣</p>
                            </div>


                        </div>
                    </div>

                </div>
                <div class="col-sm-4 content_3_small_div" >
                    <div class="panel panel-default">
                        <div class="panel-body" >
                            <span  class=" glyphicon glyphicon-comment span_ico_size" aria-hidden="true"></span><br>
                            <div style="margin-bottom: 5px">
                                <h2>社交</h2>
                                <p>知识的分享比拥有更令人快乐，通过圈子，传递您的思想</p>

                            </div>


                        </div>
                    </div>

                </div>

                <div class="col-sm-4 content_3_small_div" >
                    <div class="panel panel-default">
                        <div class="panel-body" >
                            <span  class="glyphicon glyphicon-hand-right span_ico_size" aria-hidden="true"></span><br>
                            <div style="margin-bottom: 5px">
                                <h2>讨论</h2>
                                <p>观点碰撞，话题引起思辨，旁征博引，由浅入深</p>

                            </div>


                        </div>
                    </div>

                </div>


             </div>

        </div>

        <div class="col-sm-12" style="height: 500px;">
            <div class="col-sm-3 col-sm-offset-1" style="margin-top: 20px;margin-bottom:20px">
                <h2 class="display_win_h2" >文档社区，让您无论在何处都可以畅快阅读</h2>
            </div>
        </div>


        <div class="col-sm-12 content_big_div">

            <div class="col-sm-4" ng-repeat="single in articleData">

                        <div class="thumbnail" >
                            <img src="/getImage/@{{ single.article_image }}" class="img-rounded img-responsive" alt="...">
                            <div class="caption">
                                <h3>@{{ single.article_title }}</h3>
                                <p>@{{ single.article_intro }}</p>
                                <p><a href="/index_articleDetail/@{{ single.article_id}}}" class="btn btn-primary" role="button">查看详情</a></p>
                            </div>
                        </div>

            </div>
        </div>

    </div>


    <link rel="stylesheet" href="/css/Index/index.css"/>
    <script>
        $(document).ready(function(){




        });


    </script>
@stop



@section("head")
    @parent
    @include("my_ui")
@append


@section("ngJs")
    @include("ng_lib")
    <script src="/webapp/scripts/controllers/IndexController.js"></script>
@append

@section("message")
    @parent
    <div  header-msg  p-msg="@{{headerMsg.msg}}" p-status="@{{headerMsg.status}}" p-auto-hide="true"></div>
@append
